<template>
  <div class="my-detail-box">
    <div class="my-content-box df aic jcsb" style="height: 50px">
      <div class="icon-box df aic" @click="proxy.$router.go(-1)">
        <i class="iconfont icon-fanhui1"></i>
        <span>返回</span>
      </div>
    </div>
    <div class="my-content-box content-box">
      <div class="detail-item-box">
        <div v-for="(item, index) in state.detailItemList" :key="index" class="detail-item">
          <span class="label">{{ item.name }}:</span>
          <span v-if="item.key == 'businessLicenseUrl'" class="img-box"
            ><img :src="state.formData.businessLicenseUrl" alt=""
          /></span>
          <span v-else class="text">{{ state.formData[item.key] }}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { useProxy } from '@/utils/proxy'
import { getDetailById } from './api'
const { proxy } = useProxy()
const areaId = proxy.$route.params && (proxy.$route.params.areaId as string)
const state = reactive({
  detailItemList: [
    { key: 'enterpriseId', name: '企业编号' },
    { key: 'enterpriseName', name: '企业名称' },
    { key: 'corporationName', name: '集团名称' },
    { key: 'areaCode', name: '区域编码' },
    { key: 'enterpriseTypeName', name: '企业类型' },
    { key: 'address', name: '企业地址' },
    { key: 'legalPerson', name: '法人' },
    { key: 'cellPhoneNo', name: '手机号' },
    { key: 'identityCard', name: '身份证号' },
    { key: 'mailBox', name: '邮箱' },
    { key: 'remark', name: '备注' },
    { key: 'hasRepayPrincipal', name: '已还本金总额(万)' },
    { key: 'noRepayPrincipal', name: '未还本金总额(万)' },
    { key: 'hasRepayInterest', name: '已还利息总额(万)' },
    { key: 'noRepayInterest', name: '未还利息总额(万)' },
    { key: 'hasDebtNum', name: '未完成债务个数' },
    { key: 'businessLicense', name: '营业执照编号' },
    { key: 'businessLicenseUrl', name: '营业执照图片' }
    // { key: 'otherCostType', name: '其他费用类型' },
    // { key: 'otherCostAmount', name: '其他费用金额' },
    // { key: 'contractRate', name: '合同利率' },
    // { key: 'continueLoan', name: '是否可以续贷' },
    // { key: 'isChengtou', name: '是否城投债' },
    // { key: 'isZhiya', name: '金额存单质押' }
  ],
  formData: {
    enterpriseId: '',
    areaCode: '',
    enterpriseTypeName: '',
    enterpriseName: '',
    corporationName: '',
    legalPerson: '',
    cellPhoneNo: '',
    identityCard: '',
    mailBox: '',
    address: '',
    businessLicense: '',
    businessLicenseUrl: '',
    remark: '',
    hasRepayPrincipal: '',
    noRepayPrincipal: '',
    hasRepayInterest: '',
    noRepayInterest: '',
    hasDebtNum: ''
  } as any
})
// 获取详情
const getDetail = async () => {
  let data = await getDetailById<any>(areaId)
  const form = {} as any
  Object.keys(state.formData).forEach((item, index) => {
    form[item] = data[item] ?? ''
  })
  state.formData = form
}
getDetail()
</script>

<style lang="scss" scoped>
.content-box {
  margin-top: 9px;
  height: calc(100% - 70px);
}
</style>
